<template>
    <div id="top">
    <!--左-->
    <div class="topleft" @click="tiaozhuan"> 
        <!-- 以下语句是为了使用有色图标 -->
        <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-arrow-left"></use>
        </svg>
    </div>

    <div class="topContent">
        <span>全部功能</span>
    </div>

    <div class="topright" @click="xiaoxizhanshi"> 
        <!-- 以下语句是为了使用有色图标 -->
        <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-xiaoxiyangshi"></use>
        </svg>
    </div>

</div>
</template>

<script>
export default{
    name:"Top",
    methods:{
        //跳转到首页
        tiaozhuan:function(){
            this.$router.replace('/shouye')
        },
        xiaoxizhanshi:function(){
            this.$router.replace('/xiaoxizhanshi')
        }
    }
}
</script>

<style lang="less" scoped>
#top{
        width: 100%;
        height: 50px;
        //弹性布局！！！！！
        display: flex;                 ///！！！！！！
        justify-content: space-between; ///！！！！！！
        align-items: center;//垂直居中
    }

</style>